<template>
  <div style="margin-top:300px">
    <div>{{count}}</div>
    <div>
      <button @click="TEST_ADD()">+1</button>    <!-- 事件处理函数变为add -->
      <button @click="jianshao()">-1</button>
    </div>
    <div>
      <valid :inputType="'account'"></valid>
      <valid :inputType="'password'"></valid>
    </div>
    <div v-login-input-wrapper style="width: 300px">
      <input type="text" v-login-input placeholder="请输入账号!">
    </div>
  </div>
</template>

<script>
  import { mapActions, mapGetters } from 'vuex'
  import { TEST_ADD, TEST_SUBTRACT, GET_COUNT, INITIALIZE } from '../store/mutation-types'
  export default {
    computed: mapGetters({
      count: GET_COUNT
    }),
    mounted: function () { // 每次路由到这个页面会自动执行里面方法
      this.$store.dispatch(INITIALIZE, 12)
    },
    methods: {
      ...mapActions([TEST_ADD]),

      // mapActions 对应做出改变
      ...mapActions({
        jianshao: TEST_SUBTRACT
      })
    }
  }
</script>
